<template>
  <j-modal
    :confirmLoading='confirmLoading'
    :maskClosable='false'
    :title='title'
    :visible='visible'
    :width='1200'
    cancelText='关闭'
    switchFullscreen
    @cancel='handleCancel'
    @ok='handleOk'>
    <template slot="footer">
      <a-button type="primary" @click="handleCancel" >关闭</a-button>
    </template>
    <div>
      <a-divider orientation='left' style='font-weight: 600;margin-top: 0px;'>库存明细</a-divider>
      <a-form-model :label-col='labelCol' :model='form' :wrapper-col='wrapperCol'>
          <a-col :md='8' :sm='24'>
            <a-form-model-item label='经销商编码'>
              <span></span>
            </a-form-model-item>
          </a-col>
          <a-col :md='8' :sm='24'>
            <a-form-model-item
              label='经销商名称'
            >
              <span></span>
            </a-form-model-item>
          </a-col>
          <a-col :md='8' :sm='24'>
            <a-form-model-item
              label='经销商类型'
            >
              <span></span>
            </a-form-model-item>
          </a-col>
          <a-col :md='8' :sm='24'>
            <a-form-model-item
              label='库存时间'
            >
              <span></span>
            </a-form-model-item>
          </a-col>
          <a-col :md='8' :sm='24'>
            <a-form-model-item
              label='最近一次盘库时间'
            >
              <span></span>
            </a-form-model-item>
          </a-col>
      </a-form-model>
    </div>
    <a-divider orientation='left' style='font-weight: 600;margin-top: 0px;'>库存明细</a-divider>

<!--      <div v-for='(item,index) in forms' :key='index'>-->
        <a-form-model :label-col='labelCol' :model='form' :wrapper-col='wrapperCol'>
          <a-col :md='8' :sm='24'>
            <a-form-model-item label='盘库时间'>
              <span></span>
            </a-form-model-item>
          </a-col>
          <a-col :md='8' :sm='24'>
            <a-form-model-item label='商品数量'>
              <span></span>
            </a-form-model-item>
          </a-col>
          <a-col :md='8' :sm='24'>
            <a-form-model-item label='盘库人员'>
              <span></span>
            </a-form-model-item>
          </a-col>
          <a-col :md='8' :sm='24'>
            <a-form-model-item label='盘库定位'>
              <span></span>
            </a-form-model-item>
          </a-col>
          <a-col :md='8' :sm='24'>
            <a-form-model-item label='所属组织'>
              <span></span>
            </a-form-model-item>
          </a-col>
          <a-col :md='8' :sm='24'>
            <a-form-model-item label='职位名称'>
              <span></span>
            </a-form-model-item>
          </a-col>
          <a-col :md='8' :sm='24'>
            <a-form-model-item label='系列数'>
              <span></span>
            </a-form-model-item>
          </a-col>
          <a-col :md='8' :sm='24'>
            <a-form-model-item label='商品种数'>
              <span></span>
            </a-form-model-item>
          </a-col>
        </a-form-model>
        <div style='padding: 10px 80px'>
          <a-table
            ref='table'
            :columns='columns'
            :loading='loading'
            :scroll='{x:400,y:240 }'
            bordered
            rowKey='id'
            size='middle'>
          </a-table>
        </div>
<!--      </div>-->
  </j-modal>
</template>

<script>

export default {
  name: 'InventoryDetails',
  data() {
    return {
      forms:{},
      name: '',
      title: '操作',
      visible: false,
      isEdit:false,
      model: {},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 9 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 24 },
      },
      confirmLoading: false,
      form: this.$form.createForm(this),
      columns:[
        {
          title: '产品层级编码',
          align: 'center',
          dataIndex: 'custCode'
        },
        {
          title: '产品层级名称',
          align: 'center',
          dataIndex: 'custName'
        },
        {
          title: '上级产品层级',
          align: 'center',
          dataIndex: 'custName'
        },
        {
          title: '产品编码',
          align: 'center',
          dataIndex: 'custName'
        },
        {
          title: '产品名称',
          align: 'center',
          dataIndex: 'custName'
        },
        {
          title: '数量',
          align: 'center',
          dataIndex: 'custName'
        },
      ]
    }
  },
  created() {

  },
  computed: {},
  methods: {
    add() {
      this.edit()
    },
    edit(isEdit) {
      this.visible = true
      this.form.resetFields()

    },
    handleCancel() {
      this.$emit('close')
      this.form.resetFields()
      this.isEdit=false
      this.model={}
      this.visible = false
    },
    handleOk() {
      handleCancel()
    },
    pdDetailChange(e){
      this.model.detailPc=e[0].url
    },
    xptiem(e){
      this.$set(this.model,"isNew",e)
    },
    close() {
      // this.handleCancel()
    },
  }
}
</script>

<style lang='less' scoped>
.info-line {
  display: flex;
  flex-direction: row;
}

.info-line:before {
  content: "";
  flex: 0.1;
  border-bottom: 1px solid #ebedee;
  margin: auto 4px;
}
.info-line:after {
  content: "";
  flex: 0.9;
  border-bottom: 2px solid #ebedee;
  margin: auto 4px;
}
</style>
